<template>
  <div>
    <el-form
      ref="postForm"
      :model="postForm"
      :rules="rules"
      label-width="260px"
      label-suffix=":"
    >
      <sticky :z-index="10" :class-name="'sub-navbar ' + postForm.status">
        <el-button v-loading="loading" style="margin-left: 10px;" type="success" @click="submitForm">
          保存
        </el-button>
      </sticky>

      <div style="padding: 15px">
        <el-row>
          <el-col :span="22">
            <el-form-item label="会员" style="width: 500px">
              <el-input v-model="postForm.vip1_price" />
              <span>零售价格</span>
            </el-form-item>
            <el-form-item label="默认进云仓数量" style="width: 500px">
              <el-input v-model="postForm.store_begin" />
              <span>多少盒进云仓, 0表示全部默认进云仓</span>
            </el-form-item>
            <el-divider />
            <el-form-item label="顾客一次性购买金额" style="width: 500px">
              <el-input v-model="postForm.vip2_amount" />
            </el-form-item>
            <el-form-item label="顾客累计购买盒数" style="width: 500px">
              <el-input v-model="postForm.vip2_box" />
            </el-form-item>
            <el-form-item label="VIP一次性购买金额" style="width: 500px">
              <el-input v-model="postForm.vip3_amount" />
            </el-form-item>
            <el-form-item label="VIP累计购买盒数" style="width: 500px">
              <el-input v-model="postForm.vip3_box" />
            </el-form-item>
            <el-form-item label="经销商一次性购买金额" style="width: 500px">
              <el-input v-model="postForm.svip1_amount" />
            </el-form-item>
            <el-form-item label="经销商累计购买盒数" style="width: 500px">
              <el-input v-model="postForm.svip1_box" />
            </el-form-item>
            <el-form-item label="区代一次性购买金额" style="width: 500px">
              <el-input v-model="postForm.svip2_amount" disabled />
              <span>后台审核--手动调整</span>
            </el-form-item>
            <el-form-item label="区代累计购买盒数" style="width: 500px">
              <el-input v-model="postForm.svip2_box" disabled />
              <span>后台审核--手动调整</span>
            </el-form-item>
            <el-divider />
            <el-form-item label="顾客推顾客同级奖" style="width: 500px">
              <el-input v-model="postForm.vip2_same" />
              <span>上级出钱</span>
            </el-form-item>
            <el-form-item label="VIP推VIP同级奖" style="width: 500px">
              <el-input v-model="postForm.vip3_same" />
              <span>上级出钱</span>
            </el-form-item>
            <el-form-item label="经销商推经销商" style="width: 500px">
              <el-input v-model="postForm.svip1_same" />
              <span>平台出钱</span>
            </el-form-item>
            <el-form-item label="区代推区代" style="width: 500px">
              <el-input v-model="postForm.svip2_same" />
              <span>平台出钱</span>
            </el-form-item>
            <el-divider />
            <el-form-item label="经销商 复购" style="width: 500px">
              <el-input v-model="postForm.svip1_repeat" />%
              <span>百分比, 经销商推经销商 复购</span>
            </el-form-item>
            <el-form-item label="区代 复购奖" style="width: 500px">
              <el-input v-model="postForm.svip2_repeat" />
              <span>按真实收货地址返佣金</span>
            </el-form-item>
            <el-divider />
            <el-form-item label="分红条件" style="width: 500px">
              <el-input v-model="postForm.address_num" />
              <span>区代直推几个区代</span>
            </el-form-item>
            <el-form-item label="分红奖金" style="width: 500px">
              <el-input v-model="postForm.address_award" />
              <span> 团队每产生的订单，每盒拿30元</span>
            </el-form-item>
            <el-divider />
            <el-form-item label="条件" style="width: 500px">
              <el-input v-model="postForm.box_num" />
              <span>直推多少个经销商</span>
            </el-form-item>
            <el-form-item label="业绩奖1 盒数" style="width: 500px">
              <el-input v-model="postForm.box1" />
            </el-form-item>
            <el-form-item label="业绩奖1 奖金" style="width: 500px">
              <el-input v-model="postForm.box1_award" />
              <span>每盒的奖金</span>
            </el-form-item>
            <el-form-item label="业绩奖2 盒数" style="width: 500px">
              <el-input v-model="postForm.box2" />
            </el-form-item>
            <el-form-item label="业绩奖2 奖金" style="width: 500px">
              <el-input v-model="postForm.box2_award" />
              <span>每盒的奖金</span>
            </el-form-item>
            <el-form-item label="业绩奖3 盒数" style="width: 500px">
              <el-input v-model="postForm.box3" />
            </el-form-item>
            <el-form-item label="业绩奖3 奖金" style="width: 500px">
              <el-input v-model="postForm.box3_award" />
              <span>每盒的奖金</span>
            </el-form-item>
            <el-form-item label="业绩奖4 盒数" style="width: 500px">
              <el-input v-model="postForm.box4" />
            </el-form-item>
            <el-form-item label="业绩奖4 奖金" style="width: 500px">
              <el-input v-model="postForm.box4_award" />
              <span>每盒的奖金</span>
            </el-form-item>
          </el-col>
        </el-row>
      </div>

    </el-form>
  </div>
</template>

<script>
import Sticky from '@/components/Sticky'
import api from '@/api'
export default {
  name: 'SystemFlow',
  components: {
    Sticky
  },
  data() {
    return {
      postForm: {
        status: 'draft'
      },
      rules: {
      },
      loading: false
    }
  },
  created() {
    this.fetchData()
  },
  methods: {
    async fetchData() {
      const { data } = await api.member.fetchSet()
      this.postForm = Object.assign({}, data)
      this.postForm.status = 'publisher'
    },
    submitForm() {
      this.$refs.postForm.validate(validate => {
        if (validate) {
          this.loading = true
          api.member.saveSet({
            ...this.postForm
          }).then(response => {
            this.$notify({
              title: '成功',
              message: response.message || '保存成功',
              type: 'success',
              duration: 2000
            })
            this.loading = false
          }).catch(() => {
            this.loading = false
          })
        }
      })
    }
  }
}
</script>
